@extends('layouts.home')
@section('title', '犯二青年博客-' .$article->title)
@section('content')
    <section class="container">
        <div class="content-wrap">
            <div class="content">
                <header class="article-header">
                    <h1 class="article-title">
                        <a href="/article/{{ $article->id }}">{{ $article->title }}</a>
                    </h1>
                    <div class="article-meta">
                        <span class="item article-meta-time">
                            <time class="time" data-toggle="tooltip" data-placement="bottom" title="时间：{{ $article->updated_at }}">
                                <i class="glyphicon glyphicon-time"></i> {{ $article->updated_at }}</time>
                        </span>
                        <span class="item article-meta-source" data-toggle="tooltip" data-placement="bottom"
                              title="来源：犯二青年博客">
                            <i class="glyphicon glyphicon-globe">

                            </i>
{{--                            {{ $article->user->name }}--}}
                            犯二青年
                        </span>
                        <span class="item article-meta-category" data-toggle="tooltip" data-placement="bottom"
                              title="栏目：{{ $article->category->name }}">
                            <i class="glyphicon glyphicon-list">

                            </i>
                            <a href="program" title="">
                                {{ $article->category->name }}
                            </a></span> <span class="item article-meta-views" data-toggle="tooltip"
                                              data-placement="bottom" title="查看：{{ $article->click }}">
                            <i class="glyphicon glyphicon-eye-open">

                            </i> 共{{ $article->click }}人围观
                        </span>
                        <span class="item article-meta-comment" data-toggle="tooltip" data-placement="bottom"
                              title="评论：{{ $article->getSumComments() }}">
                            <i class="glyphicon glyphicon-comment">

                            </i> {{ $article->getSumComments() }}条评论
                        </span>
                    </div>
                </header>
                <article class="article-content">
                    <p>
                        @if($article->cover)
                            <img data-original="{{ qiniu_url($article->cover) }}" src="{{ qiniu_url($article->cover) }}" alt="{{ $article->title }}"/>
                            @else
                            <img data-original="{{ URL::asset('images/banner/banner_03.jpg') }}" src="{{ URL::asset('images/banner/banner_03.jpg') }}" alt="{{ $article->title }}"/>
                        @endif
                    </p>
                    <div class="markdown" id="category">
                        {!! $article->content !!}
                        <p class="article-copyright hidden-xs">未经允许不得转载：<a href="findcat.cn">犯二青年博客</a> » <a
                                href="/article/{{ $article->id }}">{{ $article->title }}</a></p>
                </article>
                <div class="article-tags">标签：
                    @foreach($article->tags as $tag)
                        <a href="" rel="tag">{{ $tag->name }}</a>
                    @endforeach
                </div>
                <div class="relates">
                    <div class="title">
                        <span class="l-h3">相关推荐</span>
                    </div>
                    <ul>
                        {{--                        ajax占位--}}
                    </ul>
                </div>
                <div class="title" id="comment">
                    <span class="l-h3">评论 <small>抢沙发</small></span>
                </div>


                @guest
                    <div id="respond">
                        <div class="comment-signarea">
                            <span class="text-muted l-h3">评论前必须登录！</span>
                            <p><a href="javascript:;" class="btn btn-primary login" data-toggle="modal" data-target="#loginModal" rel="nofollow">立即登录</a> &nbsp; <a
                                    href="javascript:;" class="btn btn-default register" data-toggle="modal" data-target="#WeChat" rel="nofollow">注册</a></p>

{{--                            <a data-toggle="modal" data-target="#loginModal" class="login" rel="nofollow">Hi,请登录</a>--}}
                        </div>
                    </div>
                @else
                    <div id="respond">
                        <form action="{{ url('comment') }}" method="post" id="comment-form">
                            <div class="comment">
                                <div class="comment-title">
                                    @if(empty($comments->user->userOath->avatar))
                                        <img class="avatar" src="{{ qiniu_url('380x380.png') }}" alt=""/>
                                    @else
                                        <img class="avatar" src="{{ $comments->user->userOath->avatar }}" alt=""/>
                                    @endif
                                </div>
                                <div class="comment-box">
                                    <textarea placeholder="您的评论可以一针见血" name="comment" id="comment-textarea" cols="100%" rows="3" tabindex="1"></textarea>
                                    <div class="comment-ctrl">
                                        <span class="emotion">
                                            <img src="{{ qiniu_url('images/face/5.png') }}" width="20" height="20" alt=""/>表情
                                        </span>
                                        <div class="comment-prompt">
                                            <i class="fa fa-spin fa-circle-o-notch">

                                            </i>
                                            <span class="comment-prompt-text">

                                            </span>
                                        </div>
                                        <input type="hidden" name="_token" id="comment-token" value="{{ csrf_token() }}"/>
                                        <input type="hidden" value="1" class="articleid"/>
                                        <button type="submit" name="comment-submit" id="comment-submit" tabindex="5" articleid="1">评论</button>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                @endguest

                <div id="postcomments">

                    @foreach ($article->comments as $comments)
                        <ol class="commentlist">
                            <li class="comment-content"><span class="comment-f">#1</span>
                                <div class="comment-avatar">
                                    @if(empty($comments->user->userOath->avatar))
                                        <img class="avatar" src="{{ qiniu_url('380x380.png') }}" alt=""/>
                                    @else
                                        <img class="avatar" src="{{ $comments->user->userOath->avatar }}" alt=""/>
                                    @endif
                                </div>
                                <div class="comment-main">
                                    <p>用户：<span class="address">{{ $comments->user->name }}</span>说出了自己的看法：<span
                                            class="time">({{ $comments->updated_at }})</span><br/>
                                        {{ $comments->content }}
                                    </p>
                                </div>
                            </li>
                        </ol>
                    @endforeach


{{--                    <div class="quotes"><span class="disabled">首页</span><span class="disabled">上一页</span><a--}}
{{--                            class="current">1</a><a href="">2</a><span class="disabled">下一页</span><span--}}
{{--                            class="disabled">尾页</span></div>--}}
                </div>

            </div>
        </div>
        @include('layouts._right_article')
    </section>
@endsection

@section('script')
@endsection
